<template>
  <div
    class="cover animate__animated"
    :class="{ animate__bounceOutLeft: isStart }"
  >
    <img alt="logo" class="logo" :src="logo" />
    <a-divider>春秋蝉</a-divider>
    <a-button size="large" type="primary" @click="start"> 启 动 ! </a-button>
  </div>
</template>
<script setup lang="ts">
import logo from '@renderer/assets/icon.svg';
import { ref } from 'vue';
import { useRouter } from 'vue-router';

const router = useRouter();
const isStart = ref(false);
const start = () => {
  isStart.value = true;
  setTimeout(() => {
    router.push('/workbench');
  }, 500);
};
</script>
<style scoped lang="less">
.cover {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  .logo {
    -webkit-app-region: drag;
  }
}
</style>
